/**
* @author zhaojiuyi
* @date 2022/12/8-20:46
* @version 1.0.0
*/
:root {
    --titleHeight: 3.4rem;
    --headerColor: #ffffff;
    --footerColor: #444444;
    --mainPadding: 15rem;
}

@media screen and (max-width: 750px) {
    .title {
        display: none !important;
    }

}

@media screen and (max-width: 1024px) {
    .header {
        padding: 5px 10px !important;
    }

    .main {
        padding: 10px !important;
    }
}

html {
    font-size: 16px;
}

#adminApp {
    width: 100vw;
    height: 100vh;
}

/*------------ header -------------*/
.header {
    height: var(--titleHeight);
    background: var(--headerColor);
    box-sizing: border-box;
    padding: 5px var(--mainPadding);
    border-bottom: 1px solid #e9e9e9;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo {
    width: calc(var(--titleHeight) - 10px);
    aspect-ratio: 1;
}

.title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-width: 8rem;
}

.tools {
    display: flex;
}

.select_time {
    display: inline-block;
    min-width: 50px;
    border-bottom: 1px solid #a7a7a7;
}

/*----------------- main ---------------------*/
.main {
    overflow: auto;
    box-sizing: border-box;
    height: calc(100vh - (2 * var(--titleHeight)));
    padding: 10px var(--mainPadding);
}

.footer {
    height: var(--titleHeight);
    background: var(--footerColor);
}


